<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=1000, initial-scale=1.0, maximum-scale=1.0">
	    <!-- Loading Bootstrap -->
	    <link href="Public/Admin/Flat/dist/css/vendor/bootstrap.min.css" rel="stylesheet">
	    <!-- Loading Flat UI -->
	    <link href="Public/Admin/Flat/dist/css/flat-ui.css" rel="stylesheet">
	    <link href="Public/Admin/Flat/docs/assets/css/demo.css" rel="stylesheet">
	    <link rel="shortcut icon" href="Public/Admin/Flat/img/favicon.ico">
    	<link href="Public/css/bootstrap.min.css" rel="stylesheet">
    	<link href="Public/css/common.css" rel="stylesheet">
		<script src="Public/js/jquery-1.7.2.min.js"></script>
		<script src="Public/js/bootstrap.min.js"></script>
    	<script type="text/javascript">
		   $(function(){
		      $('#myTab li:eq(0) a').tab('show');
		   });
		</script>
	    <!--载入百度编辑器-->
	    	<script type="text/javascript" charset="utf-8" src="Public/ueditor1_4_3/ueditor.config.js"></script>
    		<script type="text/javascript" charset="utf-8" src="Public/ueditor1_4_3/ueditor.all.min.js"> </script>
    		<script type="text/javascript" charset="utf-8" src="Public/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>
	</head>
	
	<body>
		<form action="" method="post" enctype="multipart/form-data">

	  <ul id="myTab" class="nav nav-tabs">
	   <li class="active"><a href="#tab1" data-toggle="tab">
	      基本设置</a>
	   </li>
	   <li><a href="#tab2" data-toggle="tab">规格属性</a></li>
	   <li><a href="#tab3" data-toggle="tab">图片设置</a></li>
	   <li><a href="#tab4" data-toggle="tab">产品详情</a></li>
	   <li><a href="#tab5" data-toggle="tab">售后服务</a></li>
	   
	   <li class="dropdown">
	      <a href="#" id="myTabDrop1" class="dropdown-toggle" 
	         data-toggle="dropdown"> 确定  <b class="caret"></b>
	      </a>
	      <ul style="padding: 5px;" class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
	         <li><button class="btn btn-primary btn-block" type="submit"> 确定 </button>
	         </li>
	         <li><button style="margin-top: 5px;" class="btn btn-default btn-block" type="reset"> 清空 </button>
	         </li>
	      </ul>
	   </li>
	</ul>
<div id="myTabContent" class="tab-content">
   <div class="tab-pane fade in active" id="tab1">
		
<div class="alert alert-success">基本设置</div>
	<table class=''>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">商品名称</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商品名称"  name="gname">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">货号</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="为空时随机生成" name="gnum">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">单位</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" value="件" name="gunit">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">市场价</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入市场价" name="gmarketprice">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">商城价</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商城价" name="gshopprice">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">总库存</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入总库存" name="gcount">								
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">点击量</label></td>
						<td style="padding-right: 20%;">
							<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入点击量" name="gclick">
						</td>
		</tr>
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">所属分类</label></td>
						<td style="padding-right: 50%;">
							<select name="category_cid" class="form-control">
								<option value="">请选择</option>
																	<option value="1" tid="7">手机通讯/ 手机配件</option>
																	<option value="9" tid="7">└─ 手机通讯</option>
																	<option value="13" tid="7">├─ 手机配件</option>
																	<option value="14" tid="7">├─ 通讯产品</option>
																	<option value="2" tid="8">笔记本/平板/品牌整机</option>
																	<option value="15" tid="8">├─ 笔记本</option>
																	<option value="16" tid="8">├─ 平板</option>
																	<option value="17" tid="8">├─ 品牌整机</option>
																	<option value="3" tid="9">摄影摄像/相机配件</option>
																	<option value="18" tid="9">├─ 摄影摄像</option>
																	<option value="19" tid="9">├─ 相机配件</option>
																	<option value="4" tid="10">游戏电玩/游戏本</option>
																	<option value="20" tid="10">├─ 游戏电玩</option>
																	<option value="21" tid="10">├─ 游戏本</option>
																	<option value="5" tid="11">DIY硬件/外设配件</option>
																	<option value="22" tid="11">├─ DIY硬件</option>
																	<option value="23" tid="11">└─ 外设配件</option>
																	<option value="32" tid="11">└─ 网络设备</option>
																	<option value="6" tid="12">智能生活/数码配件</option>
																	<option value="25" tid="12">├─ 智能生活</option>
																	<option value="26" tid="12">├─ 数码配件</option>
																	<option value="27" tid="12">├─ 平板配件</option>
																	<option value="7" tid="13">办公设备</option>
																	<option value="28" tid="13">├─ 办公设备</option>
																	<option value="8" tid="14"> 生活家电/家庭影音/个护</option>
																	<option value="29" tid="14">├─ 生活家电</option>
																	<option value="30" tid="14">├─ 家庭影音</option>
																	<option value="31" tid="14">├─ 个护</option>
															</select>
						</td>
		</tr>
		
		<tr class="info">
						<td><label style="float: right;padding-right: 10%;" for="exampleInputEmail1">所属品牌</label></td>
						<td style="padding-right: 50%;">
							<!--载入品牌-->
							<select name="brand_bid" class="form-control">
								<option value="">请选择</option>	
																	<option value="1">苹果</option>
															</select>
						</td>
		</tr>
	</table>

   </div>
   <div class="tab-pane fade" id="tab2">
		<script type="text/javascript">
	$(function(){
		$('[name=category_cid]').change(function(){
//			抓取选中的类型id
			var tid = $('option:selected').attr('tid');
			$.ajax({
				type:"post",
				url:"http://localhost/c58/lianxi/zol-subject/index.php?m=Admin&c=Goods&a=getTypeAttr",
				data:{id:tid},
				dataType:'json',
				success:function(phpData){
					//规格(可选)
					var spec = '';
					//属性（不可选）
					var attr = '';
					$.each(phpData,function(k,v){
						//规格
						if(v.taclass == 1){
								spec += '<tr class="info"><td>'+v.taname+'</td><td><select name="spec['+v.taid+'][value][]" id=""><option value="">请选择</option>';
								$.each(v.tavalue, function(kk,vv) {    
									spec += '<option value="'+vv+'">'+vv+'</option>';                                                      
										});
									spec += '</select></td><td>附加价格：<input type="text" name="spec['+v.taid+'][price][]" id="" /></td><td><span class="btn btn-success add-spec">增加规格</span></td></tr>';
						}else{
						//属性
						attr += '<tr class="info"><td>'+v.taname+'</td><td><select name="attr['+v.taid+']" id=""><option value="">请选择</option>';
						$.each(v.tavalue, function(kk,vv) {    
							attr += '<option value="'+vv+'">'+vv+'</option>';                                                      
												});
								attr += '</select></td></tr>';
							}
					})
					$('#attr').html(attr);
					$('#spec').html(spec);
				}
			});
		})
		
		//点击添加规格
		$('.add-spec').live('click',function(){
			//找到父级的tr
			var parentsTr = $(this).parents('tr');
			//把父级的tr克隆复制
			var cloneTr = parentsTr.clone();
			cloneTr.find('.add-spec').removeClass('add-spec btn-success').addClass('remove-spec btn-danger').html('删除规格');
			//插入下一行
			parentsTr.after(cloneTr);
		})
		//删除规格
		$('.remove-spec').live('click',function(){
			$(this).parents('tr').remove();
		})
	})
</script>
<div class="alert alert-success">商品规格</div>
	<table class="table table-bordered table-hover" id='spec' class="info">
				
				
				
	</table>
<div class="alert alert-success">商品属性</div>
	<table class="table table-bordered table-hover" id='attr' class="info">
				
				
				
	</table>
   </div>
   <div class="tab-pane fade" id="tab3">
          <script type="text/javascript" src="Public/uploadify/jquery.uploadify.min.js"></script>
    <link rel="stylesheet" type="text/css" href="Public/uploadify/uploadify.css">


<div class="alert alert-success">列表图片</div>
	<div class="form-group">
		
		<div lab="uploadFile">
	    <input id="a" type="file" multiple="true">
	    <span>列表图片 类型: *.jpg,*.png,*gif; 大小: 2000KB 列表图片只能上传一张</span>
	    <script type="text/javascript">
	        $(function() {
	            $('#a').uploadify({
	                'formData'     : {//POST数据
	                    'hdcmsid' : '1p8hs8t23u6cmp70v5tj1anjo1',
	                },
	                'fileTypeDesc' : '上传文件',//上传描述
	                'fileTypeExts' : '*.jpg;*.gif;*.png',
	                'swf'      : 'http://localhost/c58/lianxi/zol-subject/Public/uploadify/uploadify.swf',
	                'uploader' : 'http://localhost/c58/lianxi/zol-subject/index.php?m=Admin&c=Goods&a=uploadgpic',
	                'buttonText':'选择文件',
	                'fileSizeLimit' : '2000KB',
	                'uploadLimit' : 1,//上传文件数
	                'width':65,
	                'height':25,
	                'successTimeout':10,//等待服务器响应时间
	                'removeTimeout' : 0.2,//成功显示时间
	                'onUploadSuccess' : function(file, data, response) {
	                    //转为json
	                    data=$.parseJSON(data);
	                    //获得图片地址
	                    var imageUrl = data.url;
	                    var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+imageUrl+"'/><input type='hidden' name='gpic' value='"+data.path+"'/></li>";
	                    $("#uploadLista1 ul").prepend(li);
	                }
	            });
	        });
	    </script>
	    <div id="uploadLista1">
	        <ul>
	
	        </ul>
	    </div>
	    </div>
	</div>

	<div class="alert alert-success">商品图片</div>
	<div class="form-group">
		<div lab="uploadFile">
	    <input id="b" type="file" multiple="true">
	    <span>商品图片 类型: *.jpg,*.png,*gif; 大小: 2000KB 单次最大数量: 5</span>
	    <script type="text/javascript">
	        $(function() {
	            $('#b').uploadify({
	                'formData'     : {//POST数据
	                    'hdcmsid' : '1p8hs8t23u6cmp70v5tj1anjo1',
	                },
	                'fileTypeDesc' : '上传文件',//上传描述
	                'fileTypeExts' : '*.jpg;*.gif;*.png',
	                'swf'      : 'http://localhost/c58/lianxi/zol-subject/Public/uploadify/uploadify.swf',
	                'uploader' : 'http://localhost/c58/lianxi/zol-subject/index.php?m=Admin&c=Goods&a=uploadgdpic',
	                'buttonText':'选择文件',
	                'fileSizeLimit' : '2000KB',
	                'uploadLimit' : 5,//上传文件数
	                'width':65,
	                'height':25,
	                'successTimeout':10,//等待服务器响应时间
	                'removeTimeout' : 0.2,//成功显示时间
	                'onUploadSuccess' : function(file, data, response) {
	                    //转为json
	                    data=$.parseJSON(data);
	                    //获得图片地址
	                    var imageUrl = data.url;
	                    var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+imageUrl+"'/><input type='hidden' name='gdpic[]' value='"+data.path+"'/></li>";
	                    $("#uploadListb2 ul").prepend(li);
	                }
	            });
	        });
	    </script>
	    <div id="uploadListb2">
	        <ul>
	
	        </ul>
	    </div>
	    </div>
	</div>


	
   </div>
   <div class="tab-pane fade" id="tab4">
      <div class="form-group">
      	<div class="alert alert-success">产品详情</div>

			<!--调用百度编辑器-->
			<script id="gdcontent" type="text/plain" style="width:100%;height:500px;" name="gdcontent"></script>
		    <script>
		        var ue = UE.getEditor('gdcontent');
		    </script>
		</div>
   </div>
   <div class="tab-pane fade" id="tab5">
      <div class="form-group">
	      	<div class="alert alert-success">售后服务</div>
			<!--调用百度编辑器-->
			<script id="gdaft" type="text/plain" style="width:100%;height:300px;" name="gdaft"></script>
		    <script>
		        var ue = UE.getEditor('gdaft');
		    </script>
		</div>
   </div>
   <div class="tab-pane fade" id="tab6">
      <div class="form-group">
	      	<div class="alert alert-success">售后服务</div>
			<!--调用百度编辑器-->
			<script id="gdaft" type="text/plain" style="width:100%;height:300px;" name="gdaft"></script>
		    <script>
		        var ue = UE.getEditor('gdaft');
		    </script>
		</div>
   </div>
</div>

		</form>
	</body>
</html>
